<template>
  <PlusPage
    :columns="pageConfig"
    :table="{
      adaptive: true,
      hasIndexColumn: true,
      actionBar: { buttons, width: 140 },
    }"
    :default-page-info="{ pageSize: defaultPageSize, page: 1 }"
    :request="getList"
  />
</template>

<script lang="ts" setup>
import { type ButtonsCallBackParams, type PlusColumn, useTable } from '@wlydfe/pro-ui'
import { omit } from 'lodash-es'
import { workTableApi } from '@/api'
import { usePage } from '@/composables/usePage'
import { TASK_STATUS } from '@/enums/work-table/task-manage'
import { hasAuth } from '@/router/utils'


const router = useRouter();
//#region  -----------表格操作按钮-----------
const { buttons } = useTable()
buttons.value = [
  {
    text: '办理',
    code: 'handle',
    props: { type: 'primary' },
    show: computed(() => hasAuth('editBtn')),
    onClick: (params: ButtonsCallBackParams) => {
      // 跳转到办理页面
      if (params?.row) {
        router.push({
          path: '/workTable/todoTask/detail',
          query: { 
            id: params.row.processInstanceId,
            number: params.row.processNo,
            isEdit: true,
            taskId: params.row.taskId
          },
        });
      }
    },
  },
]

//#endregion

//#region  -----------页面配置-----------

const pageConfig: PlusColumn[] = [
  {
    label: '任务名称',
    prop: 'taskName',
    hideInSearch: false,
  },
  {
    label: '业务编号',
    prop: 'businessKey',
  },
  {
    label: '流程发起人',
    prop: 'startUserId',
    width: 170,
  },
  {
    label: '当前审批人',
    prop: 'taskUserId',
    width: 120,
  },
  {
    label: '流程发起时间',
    prop: 'processStartTime',
    width: 180,
    valueType: 'date-picker',
    fieldProps: {
      type: 'daterange',
      startPlaceholder: '开始时间',
      endPlaceholder: '结束时间',
      rangeSeparator: '至',
      format: 'YYYY-MM-DD HH:mm:ss',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
    },
    hideInSearch: false,
  },
  {
    label: '任务产生时间',
    prop: 'taskStartTime',
    width: 180,
    hideInSearch: false,
    valueType: 'date-picker',
    fieldProps: {
      type: 'daterange',
      startPlaceholder: '开始时间',
      endPlaceholder: '结束时间',
      rangeSeparator: '至',
      format: 'YYYY-MM-DD HH:mm:ss',
      valueFormat: 'YYYY-MM-DD HH:mm:ss',
    },
  },
]

//#endregion

//#region  -----------接口请求及参数-----------

const { getList, defaultPageSize } = usePage({
  filterModel: {
    taskStatus: TASK_STATUS.TODO,
  },
  fetchData: workTableApi.getQueryPage,
  options: {
    transformQuery: (query: Record<string, any>) => {
      if (query.processStartTime) {
        query.processStartTimeBegin = query.processStartTime[0]
        query.processStartTimeEnd = query.processStartTime[1]
      } else {
        query.processStartTimeBegin = ''
        query.processStartTimeEnd = ''
      }

      if (query.taskStartTime) {
        query.taskStartTimeBegin = query.taskStartTime[0]
        query.taskStartTimeEnd = query.taskStartTime[1]
      } else {
        query.taskStartTimeBegin = ''
        query.taskStartTimeEnd = ''
      }
      query = omit(query, ['processStartTime', 'taskStartTime'])
      return query
    },
  },
})
//#endregion
</script>
